{% load i18n %}
{% load staticfiles %}
{% load gross from prices_i18n %}
{% load get_thumbnail from product_images %}

<div class="container">
  {% if quantity > 0 %}
    <div id="cart-dropdown-list" class="cart-dropdown__list{% if lines|length <= 2 %} overflow{% endif %}">
    {% for line in lines %}
      <div class="row item">
        <div class="col-md-10">
          <a class="link--clean" href="{{ line.variant_url }}">
            <img class="cart-dropdown__image" src="{% get_thumbnail line.image size="60x60" %}" 
                 srcset="{% get_thumbnail line.image size="60x60" %} 1x, {% get_thumbnail line.image size="120x120" %} 2x" 
                 alt="">
            <h3>
              {{ line.product }}
              <span>x{{ line.quantity }}</span>
              <p>{{ line.variant }}</p>
            </h3>
          </a>
        </div>
        <div class="col-md-2">
          <div class="float-right">
            <h3>{{ line.line_total }}</h3>
          </div>
        </div>
      </div>
    {% endfor %}
    </div>
    <div class="row cart-dropdown__total" data-quantity="{{ quantity }}">
      <div class="col-md-8">
        <h3>{% trans "Subtotal" context "Order subtotal" %}
            <br>
            <span>{% trans "(Delivery calculated at checkout)" context "Cart dropdown text" %}</span></h3>
      </div>
      <div class="col-md-4">
        <h3 class="float-md-right price {% if lines|length <= 2 %}single{% endif %}" data-quantity="{{ quantity }}">
          <p>{{ total }}</p>
        </h3>
      </div>
    </div>
    <div class="row cart-dropdown__actions">
      <div class="col-md-5 offset-md-1">
        <a href="{% url "cart:index" %}" class="btn secondary narrow float-md-right">{% trans "Go to cart" context "Cart dropdown secondary action" %}</a>
      </div>
      <div class="col-md-5">
        <a href="{% url "checkout:login" %}" class="btn primary narrow">{% trans "Checkout" context "Cart dropdown primary action" %}</a>
      </div>
    </div>
  {% else %}
    <div class="text-md-center cart-dropdown__empty">
      <h3>{% trans "There are no products in your shopping cart." context "Empty cart message" %}</h3>
      <img src="{% static 'images/pirate_cart.png' %}" srcset="{% static 'images/pirate_cart.png' %} 1x, {% static 'images/pirate_cart2x.png' %} 2x">
      <a href="/" class="btn primary">{% trans "Check out our sales" context "Empty cart link" %}</a>
    </div>
  {% endif %}
</div>
